<template>
  <div>
    <bread-crumb :crumb="crumb"></bread-crumb>
    <el-row>
      <el-col :span="7">
        <el-input placeholder="请输入查询内容" v-model="queryInfo.query">
          <el-button slot="append" icon="el-icon-search"></el-button>
        </el-input>
      </el-col>
    </el-row>
    <el-card>
      <el-table :data="tableData" border stripe>
        <el-table-column type="expand">
          <template slot-scope="scope">
            {{scope.row.modulecontent}}
          </template>
        </el-table-column>
        <el-table-column type="index" label="#"></el-table-column>
        <el-table-column label="模块名称" prop="modulename"></el-table-column>
        <el-table-column label="模块描述" prop="moduledesc"></el-table-column>
        <el-table-column label="模块添加时间" prop="addtime"></el-table-column>
        <el-table-column label="模块作者" prop="moduleAuthor"></el-table-column>
        <el-table-column label="模块作者联系方式" prop="mobile"></el-table-column>
      </el-table>
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="queryInfo.pagenum"
        :page-sizes="[100, 200, 300, 400]"
        :page-size="100"
        layout="total, sizes, prev, pager, next, jumper"
        :total="400">
      </el-pagination>
    </el-card>
  </div>
</template>
<script>
import breadCrumb from '../../components/common/Breadcrumb'
export default {
  name: 'pagemodulelist',
  components: {
    breadCrumb
  },
  data () {
    return {
      crumb: ['页面管理', '页面模块列表'],
      tableData: [],
      // 查询字符串
      queryInfo: {
        query: '',
        pagenum: 1,
        pagesize: 3
      }
    }
  },
  created () {
    this.getPageModuleList()
  },
  methods: {
    async getPageModuleList () {
      const { data: res } = await this.$axios.get('pagemodulelist.json')
      if (res.meta.status !== 200) {
        return this.$message.error('获取页面模块列表失败')
      }
      this.tableData = res.data
    },
    handleSizeChange () {},
    handleCurrentChange () {}
  }
}
</script>
<style lang="scss" scoped>
.el-row {
  margin-bottom: 15px;
}
</style>
